@media only screen and (max-width: 600px) {
  .m-right-align{text-align: left;}
  .container-fluid{padding: 10px;}
  .modal-xlg {min-width: 95%;}
}
.modal-xlg {
  min-width: 90%;
}

.bg-navbar {
  background-color: #2a2b49;
}

/* * {
  font-size: 12px;
  font-weight: normal;
} */

.btn-success{
  background-color: #28a745;
}

.sidebar-light .sidebar-brand {
  color: #fafafa;
  background-color: #ffffff;
}

.select2-container--default .select2-selection--multiple{
  border-radius: 0 !important;
  width: 100% !important;
  padding: .375rem .75rem !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  color: #495057 !important;
  background-color: #fff !important;
  background-clip: padding-box !important;
  border: 1px solid #e7e7e7 !important;
}

.select2-container--default .select2-selection--single {
  height: 42px !important;
  border-radius: 0 !important;
  display: block !important;
  width: 100% !important;
  padding: .375rem .75rem !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  color: #495057 !important;
  background-color: #fff !important;
  background-clip: padding-box !important;
  border: 1px solid #e7e7e7 !important;
}
/* .alert-success {
  color: #155724;
  background-color: #d4edda;
  border-color: #c3e6cb;
}
.alert-warning {
  color: #856404;
  background-color: #fff3cd;
  border-color: #ffeeba;
}
.alert-danger {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
} */

.detailTitle{font-size: 9pt; color: #a6a6a6;}

.avatar {
  vertical-align: middle;
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.avatar100 {
  vertical-align: middle;
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

.header100{
  vertical-align: middle;
  width: auto;
  height: 100px;
  border-radius:5%;
}

.header-box{
  vertical-align: middle;
  width: 110px;
  height: 110px;
  border-radius:5%;
}

.astext {
  background:none;
  border:none;
  margin:0;
  padding:0;
  cursor: pointer;
}

.swal-text {
  text-align: center
}

.cursor-pointer{
  cursor: pointer;
}

.zoom {
  display:inline-block;
  position: relative;
}

/* magnifying glass icon */
.zoom:after {
  content:'';
  display:block; 
  width:33px; 
  height:33px; 
  position:absolute; 
  top:0;
  right:0;
  background:url(icon.png);
}

.zoom img {
  display: block;
}

.zoom img::selection { background-color: transparent; }

#ex2 img:hover { cursor: url(grab.cur), default; }
#ex2 img:active { cursor: url(grabbed.cur), default; }

.tree, .tree ul {
  margin:0;
  padding:0;
  list-style:none
}
.tree ul {
  margin-left:1em;
  position:relative
}
.tree ul ul {
  margin-left:.5em
}
.tree ul:before {
  content:"";
  display:block;
  width:0;
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  border-left:1px solid
}
.tree li {
  margin:0;
  padding:0 1em;
  line-height:2em;
  color:#369;
  font-weight:700;
  position:relative
}
.tree ul li:before {
  content:"";
  display:block;
  width:10px;
  height:0;
  border-top:1px solid;
  margin-top:-1px;
  position:absolute;
  top:1em;
  left:0
}
.tree ul li:last-child:before {
  background:#fff;
  height:auto;
  top:1em;
  bottom:0
}
.indicator {
  margin-right:5px;
}
.tree li a {
  text-decoration: none;
  color:#369;
}
.tree li button, .tree li button:active, .tree li button:focus {
  text-decoration: none;
  color:#369;
  border:none;
  background:transparent;
  margin:0px 0px 0px 0px;
  padding:0px 0px 0px 0px;
  outline: 0;
}

.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
  color: #009965;
}

/* UNTUK LIST GALLERY DI MENU EXTRAS */
div.show-image-gallery {
  position: relative;
  float:left;
  margin:5px;
}
div.show-image-gallery:hover img{
  opacity:0.5;
}
div.show-image-gallery:hover span {
  display: block;
}
div.show-image-gallery span {
  position:absolute;
  display:none;
}
div.show-image-gallery input.update {
  top:0;
  left:0;
}
div.show-image-gallery span.delete {
  top:5%;
  left:10%;
}

.label-color{
  font-size: 10pt;
  max-width: 90px;
  text-align: center !important;
}

.center-input-color{
  display: flex;
  justify-content: center
}

.input-color{
  width: 50px;
  /* height: 50px; */
  padding: 5;
}

/* Container holding the image and the text */
.container-preview {
  position: relative;
  text-align: center;
  /* color: white; */
  display: inline-block;
  padding: 10px;
  /* Fallback dashed border
     - the 4px width here is overwritten with the border-image-width (if set)
     - the border-image-width can be omitted below if it is the same as the 4px here
  */
  border: dashed 2px #c7c7c7;
  border-radius: 10px;
}

.content-card{
  position: absolute;
  cursor: pointer;
  max-height: 22px;
}

/* .default-nama-position:hover,
.default-profesi-position:hover,
.default-email-position:hover,
.default-address-position:hover,
.default-barcode-position:hover,
.default-phone-position:hover{
  transform: scale(1.1);
} */

.vertical-center {
  display: flex;
  align-items: center;
}

.app-color-background {
  color: white;
  background-color: #2a2b49;
}

.app-color {
  color: #2a2b49;
}

.header60{
  vertical-align: middle;
  width: auto;
  height: 60px;
  border-radius:5%;
}